<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用户管理</title>
<script type="text/javascript" src="../../static/easyui/jquery.min.js" charset="utf-8"></script>
	<link id="easyuiTheme" rel="stylesheet" href="../../static/easyui/themes/ui-cupertino/easyui.css">
	<link rel="stylesheet" href="../../static/easyui/themes/icon.css">
	<link rel="stylesheet" href="../../static/font/css/font-awesome.min.css">
	<script type="text/javascript" src="../../static/easyui/jquery.easyui.min.js" charset="utf-8"></script>
	<script type="text/javascript" src="../../static/easyui/locale/easyui-lang-zh_CN.js" charset="utf-8"></script>
	<script type="text/javascript" src="../../static/js/easyui_datagrid_yzy.js" charset="utf-8"></script>
	<script type="text/javascript">
	$(function(){
	
		
		var h = document.documentElement.clientHeight || document.body.clientHeight;
		$('#t_table').datagrid({
			url:'pagelist',
			idField:'id',
			pagination:true,	//分页
			pageSize:20,
			
			pageList:[5,10,20],
			height:h-29,
			fitColumns:true,	//宽度是否自适应
			striped:true,	//隔行变色 斑马色
			loadMsg:'数据正在疯狂的加载中...',//加载数据时显示的内容
			rownumbers:true,	//显示序号
			singleSelect:true,	//单选模式
			scrollbarSize:0,	//滚动条宽度
			columns:[ [
				{
					field:'name',
					title:'姓名',
					width:20,
					align:"center",
					sortable:true,
				},{
					field:'username',
					title:'邮箱/登陆账号',
					width:20,
					sortable:true,
					align:"center"
				},{
					field:'sex',
					title:'性别',
					width:10,
					sortable:true,
					align:"center"
				},{
					field:'mynumber',
					title:'电话',
					sortable:true,
					width:20,
					align:"center"
				},{
					field:'number',
					title:'在借图书数量',
					width:20,
					sortable:true, 
					align:"center",
					formatter:function(value,record,index){//鼠标悬停显示数据
						if(record.number==0){
							return record.number;
						}else{							
							return record.number+'&emsp;<a href="#" onclick="userbooks('+record.id+')"><marquee  direction="alternate"  scrollamount="15" width="15px" ><i class="fa fa-hand-o-left" style="color: red;"></i></marquee>查看借书详情</a>';
						}
					},
					
				},{
					field:'position',
					title:'身份',
					width:10,
					sortable:true,
					align:"center"
				},{
					field:'dapa',
					title:'所属部门',
					width:10,
					sortable:true,
					align:"center",
					formatter:function(value,record,index){//鼠标悬停显示数据
						return record.dapa.name;
					}
				},{
					field:'bmsRole',
					title:'职务',
					align:"center",
					width:10,
					sortable:true,
					formatter:function(value,record,index){//鼠标悬停显示数据
						var cmd=record.bmsRole[0].name;
						if(cmd=="图书管理员"){
							return "图书管理员"
						}else{
							return "用户"
						}
					},
					styler:function(value,record){/* 给某一个单元格赋予属性 */
						if(record.bmsRole[0].name == "图书管理员"){
							return 'background:#aed0ea';
						}
					}
				}
			] ],
			toolbar:[
				{
					text:'增加用户',
					iconCls:'icon-add',
					handler:function(){
						$('#mydialog').dialog({
							title:'新增用户'
						});
						//$('#mydialog').find('input[name==id]').val('');
						//$('#myform').get(0).reset();
						$('#myform').form('clear');
						$('#mydialog').dialog('open');
					}
				},
				{
					text:'修改用户',
					iconCls:'icon-edit',
					handler:function(){
						var arr= $('#t_table').datagrid('getSelections');
						if(arr.length !=1 ){
							$.messager.show({
								title:'提示',
								msg:'只能选择一行进行修改'
							});
						}else{
							$('#mydialog').dialog({
								title:'用户修改'
							});
							//1.打开窗口
							$('#mydialog').dialog('open');
							//2.清空表单数据
							$('#myform').form('clear');
							//$('#myform').get(0).reset();
							//把选中的元素放到表单
							/* console.info(arr);
							console.info(arr[0].dapa.name); */
							$('#myform').form('load',{
								id:arr[0].id,
								username:arr[0].username,
								name:arr[0].name,
								sex:arr[0].sex,
								mynumber:arr[0].mynumber,
								position:arr[0].position,
								dapa:arr[0].dapa.name
							});
						}
					}
				},{
					text:'删除用户',
					iconCls:'icon-Empty',
					handler:function(){
						var arr= $('#t_table').datagrid('getSelections');
						if(arr.length<=0){
							$.messager.show({
								title:'提示',
								msg:'请选择删除的用户'
							});
						}else{
							//获取所有删除用户的姓名 并保存下来 然后给用户提示
							var dele="";
							for(var i=0 ;i<arr.length;i++){
								dele +='('+ arr[i].name+')&emsp;';
							}
							dele = dele.substring(0 , dele.length-6)
							$.messager.confirm('确定删除?','删除名单(姓名):<br/> '+dele,function(r){
								if(r){//确定了
									var ids="";
									for(var i=0 ;i<arr.length;i++){
										ids += arr[i].id+',';
									}
									ids = ids.substring(0 , ids.length-1)
									$.post('delete',{id:ids},function(result){
										//1.刷新数据表格
										$('#t_table').datagrid('reload');
										//2.清空idField
										$('#t_table').datagrid('unselectAll');
										//2.给提示信息
										$.messager.show({
											title:'提示',
											msg:'删除成功！'
										});
									});
								}else{
									return ;
								}
							});
							
						}
					}
				},{
					text:'重置密码',
					iconCls:' icon-lock_key ',
					handler:function(){
						var arr= $('#t_table').datagrid('getSelections');
						if(arr.length !=1 ){
							$.messager.show({
								title:'提示',
								msg:'需要选择一行进行修改'
							});
						}else{
							$.messager.confirm('重置','您确认想要重置&nbsp;'+arr[0].name+'&nbsp;的密码吗？<br><br><font style="color: #787878;">提示：重置后的密码为</font>111111',function(r){    
							    if (r){    
							    	$.post('pwd',{id:arr[0].id},function(result){
										//1.刷新数据表格
										$('#t_table').datagrid('reload');
										//2.清空idField
										$('#t_table').datagrid('unselectAll');
										//2.给提示信息
										$.messager.show({
											title:'密码重置成功',
											msg:'重置后的密码为111111！'
										});
									});
							    } else{
							    	return;
							    }
							}); 
						}
					}
				},{
					text:'修改用户权限',
					iconCls:'icon-wrench_orange',
					handler:function(){
						var arr= $('#t_table').datagrid('getSelections');
						if(arr.length<=0){
							$.messager.show({
								title:'提示',
								msg:'请选择修改权限的用户'
							});
						}else{
							var ction=arr[0].bmsRole[0].code;
							var hint="";
							if(ction=="ROLE_USER"){
								hint='<font style="color: #666666;">请问是否修改&nbsp;'+arr[0].name+'&nbsp;的权限<br><br>权限从用户<b style="color: #3fc74f;">升级</b>为图书管理员</font>';
							}else if(ction=="ROLE_BOOK"){
								hint='<font style="color: #666666;">请问是否修改&nbsp;'+arr[0].name+'&nbsp;的权限<br><br>权限从图书管理员<b style="color: #f54545">降至</b>用户</font>';
							}
							$.messager.confirm('修改权限',hint,function(r){    
							    if (r){    
							    	$.post('code',{id:arr[0].id,code:ction},function(result){
							    		//1.刷新数据表格
										$('#t_table').datagrid('reload');
										//2.清空idField
										$('#t_table').datagrid('unselectAll');
										//2.给提示信息
										$.messager.show({
											title:'修改权限成功',
											msg:'修改权限成功，用户权限已被修改为：'+result
										});
									});
							    } else{
							    	return;
							    }
							}); 
						}
						
					}
				},{
					text:'刷新',
					iconCls:'icon-page_white_refresh',
					handler:function(){
						 self.location.reload();
					}
				}
				
			]
			
		});
		//点击按钮提交表单
		$('#but').click(function(){
			$("#myform").submit();
		});
		//关闭
		$('#but1').click(function(){
			$('#mydialog').dialog('close');
		});
		//提交表单前进行校验
		$('#myform').form({
			url:"save" ,
			onSubmit: function(){    
		        if(!$('#myform').form('validate'))  {
		        	$.messager.alert('警告','输入的数据不合规范，不能保存','info');
		        	return false;
		        }
		    },  
		    success:function(result){
		    	if(result=="username"){
		    		$.messager.alert('用户名重复','用户名重复解决方法：<br>更换用户名','info');
		    	}else{
		    		//1.关闭窗口
					$('#mydialog').dialog('close');
					//2.提示信息
					$.messager.show({
						title:"OK",
						msg:'操作成功'
					});
					//3.刷新页面
					$('#t_table').datagrid('reload');
		    	}
			},
			error:function(){
				$.messager.alert('警告','操作失败');
			}
		});
		//进行查询
		$('#gobtn').click(function(){
			$('#t_table').datagrid('load', serializeForm($('#mysearch').form()));
		});
		$('#removebtn').click(function(){
			//清空form表单
			$('#mysearch').form('clear');
			$("#t_table").datagrid('load', {});
		});
		
		$('#dapa').combotree({    
		    url: '../../administrator/department/treelist',    
		    required: true,
		}); 
		$('#sousuo').combotree({    
		    url: '../../administrator/department/treelist'
		}); 
	});
	function userbooks(value){
		$('#userbook').show();
		$('#userbook').load('../../admin/br/userbooks?id='+value);
		$('#userbook').dialog({
			autoOpen: true,
			width: 600,
			modal: true,
			draggable: true,
			resizable:false,
			title:"用户借书详情",
			top:100,
			});
	}
	//序列化表单
	function serializeForm(form){
		var obj = {};
		$.each(form.serializeArray(), function(index){
			if(obj[this['name']]){
				obj[this['name']] = obj[this['name']] + ',' + this['value'];
			}else{
				obj[this['name']] = this['value'];
			}
		});
		return obj;
	}
</script>
</head>
<body>
	<div id="lay" style="width: 100%;height: 100%;">
		<div region='north' class="easyui-layout" style="height: 28px;background: #f4f4f4;">
			<form action="" id="mysearch" method="post">
				<span style="line-height: 27px;color: #666666;">
					姓名:<input name="name" type="text" value="" class="easyui-textbox" >
					电话：<input name="mynumber" value="" class="easyui-textbox" width="100%" >
					所属部门<input class="easyui-combobox" id="sousuo" style="width: 150px;" name="sousuo"> 
				</span>
				<a class="easyui-linkbutton" iconCls='icon-zoom' id="gobtn">开始检索</a>
				<a class="easyui-linkbutton" iconCls='icon-undo' id="removebtn">清空条件</a>
				
			</form>
		</div>
		<div region='center'>
			<table id="t_table"></table>
		</div>
	</div>
	
	<div id="userbook" style="height: 360px;display: none;" ></div>
	
	<div id="mydialog" modal="true" title="新增图书" class="easyui-dialog" style="	"
		closed="true">
		<form class="custom-form" method="post" id="myform" enctype="multipart/form-data">
			<input type="hidden" name="id" value="">
			<table>
				<tr>
					<th>邮箱/登录账号：</th>
					<td><input class="easyui-textbox"  required="true"  type="text" name="username"   data-options="validType:'mail',prompt:'请输入用户登录账号！' "></td>
				</tr>
				<tr>
					<th>姓名:</th>
					<td><input class="easyui-textbox" required="true" type="text" name="name" id="number" data-options="prompt:'用户姓名',validType:'equals[2,5]' "></td>
				</tr>
				<tr>
					<th>联系电话:</th>
					<td><input class="easyui-textbox" type="text" name="mynumber" required="true"  data-options="prompt:'联系人电话',validType:'mynumber' "></td>
				</tr>
				<tr>
					<th>性别</th>
					<td>
					<select  class="easyui-combobox" name="sex" editable="false" data-options="prompt:'性别',required:true,missingMessage:'性别必选'" style="width:60px;" panelHeight='50px'>   
					    <option value="男">男</option>   
					    <option value="女">女</option>   
					</select>  
					</td>
				</tr>
				<tr>
					<th>身份:</th>
					<td>
						<select class="easyui-combobox" name="position" data-options="prompt:'身份',required:true,missingMessage:'身份必选'" editable="false"  style="width:60px;" panelHeight='50px'>   
						    <option value="学生">学生</option>   
						    <option value="教师">教师</option>   
						</select>
					</td>
				</tr>
				<tr>
					<th>所属部门:</th>
					<td>
						<input class="easyui-combobox" id="dapa" value="01" style="width: 100%;" name="dapa"> 
					</td>
				</tr>
				<tr>
					<td colspan="2"  >
					<a id="but" iconCls='icon-table_save' style="margin-left: 40%;margin-top: 10px;" class="easyui-linkbutton">提交</a>
					<a id="but1" iconCls='icon-cross' class="easyui-linkbutton" style="margin-top:10px;">关闭</a>
					</td>
					
				</tr>
			</table>
		</form>
	</div>
</body>
</html>